<template>
<div class="page" data-name="public-parking-lot-list">
	<div class="navbar">
		<div class="navbar-inner">
			<div class="left"></div>
			<div class="title">购物车</div>
			<div class="right"></div>
		</div>
	</div>
	<div class="page-content" style="padding-bottom: 100px;">
		<div class="cart-product-container"></div>
		<div id="id" style="left: 0px;background:#333;position: absolute;width: 100%;bottom: 44px;height:150px;z-index:10">
			<div class="id">滑动向上滚动效果</div>
		</div>
		<div class="goPaybtn">
			<a class="button button-fill button-big color-orange right payBtn">结算</a>
		</div>
	</div>
</template>


<script>

  var obj ;
  var objNewHeight;
  
  function touchMoveEvent(event){
	// 如果这个元素的位置内只有一个手指的话
		if (event.targetTouches.length == 1) {　　　　
			event.preventDefault(); // 阻止浏览器默认事件，重要 
			var touch = event.targetTouches[0];
			// 把元素放在手指所在的位置
			//obj.style.right = touch.pageX - x + 'px';
			var newHeight = (window.innerHeight-touch.pageY);
			var objHeight = parseFloat(obj.style.height.substring(0,obj.style.height.length-2));
			objNewHeight = newHeight;
			if(objHeight>newHeight){
				if(newHeight<200){
					objNewHeight  = 200;
					return;
				}
			}else{
				if(newHeight>400){
					objNewHeight = window.innerHeight;
				}
			}
			obj.style.height = newHeight + 'px';
		}
  }
  
  function touchStartEvent(event){
 			var touch = event.targetTouches[0];
 			var left = parseInt(obj.style.left);
 			// alert(left);
 			var x = touch.pageX - left;
 			var y = touch.pageY - left;
  }
  


  return {
    data: function () {
    	 var lotBatchListResult = [];
      return {
    	  lotBatchList: lotBatchListResult
      };
    },
  	on:{
  		 pageInit: function () {
  	        self = this;
  	        app = self.$app;
  	        var fruits = self.fruits;
			  	        
  	        //远程获取购物车内商品信息
  	        shop_goods = [
	           	{storeName:"测试店铺1",storeId:1,products:[{storeId:1,productId:1,img:"img/f7-icon.png",price:"100",currency:"$",quantity:1},{storeId:1,productId:2,img:"img/f7-icon.png",price:"200",currency:"$",quantity:1}]},
	           	{storeName:"测试店铺2",storeId:2,products:[{storeId:2,productId:1,img:"img/f7-icon.png",price:"300",currency:"$",quantity:2},{storeId:2,productId:1,img:"img/f7-icon.png",price:"400",currency:"$",quantity:1}]},
          	];
  	      	initCart();
  	      	
  	      	$$(".payBtn").on("click",function(){
  	      		select_goods = [];
  	      		$$('input[name="cartProduct"]:checked').each(function(){
  	      			 var selectValue = $$(this).val();
  	      			 var item = selectValue.split("-");
  	      			 select_goods.push({storeId:item[0],productId:item[1]});
  	      		});
  	      		if(select_goods.length>0){
  	      			cartView.router.navigate("/order/confirm",{force:true,history:true});
  	      		}else{
					app.dialog.alert("请选择结算产品");  	      			
  	      		}
  	      	});
			
  	      	
  	      	
    	   function load (){
    	 		/*单指拖动*/
    	 		obj = document.getElementById('id');
  		  		obj.addEventListener("touchstart",touchStartEvent,false);
 		  		obj.addEventListener('touchmove', touchMoveEvent,false);
  		  		obj.addEventListener("touchend",function(){
  		  			obj.style.height = objNewHeight + 'px';
  		  		});   
  		 	}
  		  	window.addEventListener('load',load, false);
  		}
  	}
	
  };
</script>
